<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="../themes/default/css/global/html.css" />
<link rel="stylesheet" href="../themes/default/css/global/common.css" />
<link rel="stylesheet" type="text/css" href="../plugin/jqui/css/jquery-ui-1.10.4.custom.css">
<link rel="stylesheet" type="text/css" href="../plugin/sDashboard/sDashboard.css">
<link rel="stylesheet" href="../themes/default/css/dashboard.css" />

<script type="text/javascript" src="../plugin/jquery.js"></script>
<script type="text/javascript" src="../plugin/jqui/jquery-ui-1.10.4.custom.js"></script>
<script src="../plugin/datatables/jquery.dataTables.js"> </script>
<!--[if IE]>
		<script language="javascript" type="text/javascript" src="../js/libs/flotr2.ie.min.js"></script>
<![endif]-->
<script src="../js/libs/flotr2.js"></script>
<script src="../plugin/flotr2/flotr2.js"> </script>
<script src="../plugin/sDashboard/jquery-sDashboard.js"> </script>
<script src="../plugin/sDashboard/exampleData.js" type="text/javascript"> </script>

		<!-- example code -->
		<script type="text/javascript">
			$(function() {
	

				//**********************************************//
				//dashboard json data
				//this is the data format that the dashboard framework expects
				//**********************************************//

				var dashboardJSON = [{
					widgetTitle : "Bubble Chart Widget",
					widgetId : "id009",
					widgetType : "chart",
					widgetContent : {
						data : myExampleData.bubbleChartData,
						options : myExampleData.bubbleChartOptions
					}

				}, {
					widgetTitle : "Table Widget",
					widgetId : "id3",
					widgetType : "table",
					setJqueryStyle : true,
					widgetContent : myExampleData.tableWidgetData
				}, {
					widgetTitle : "Text Widget",
					widgetId : "id2",
					widgetContent : "Lorem ipsum dolor sit amet,consectetur adipiscing elit. Aenean lacinia mollis condimentum. Proin vitae ligula quis ipsum elementum tristique. Vestibulum ut sem erat."
				}, {
					widgetTitle : "Pie Chart Widget",
					widgetId : "id001",
					widgetType : "chart",
					widgetContent : {
						data : myExampleData.pieChartData,
						options : myExampleData.pieChartOptions
					}

				}, {
					widgetTitle : "bar Chart Widget",
					widgetId : "id002",
					widgetType : "chart",
					widgetContent : {
						data : myExampleData.barChartData,
						options : myExampleData.barChartOptions
					}

				}, {
					widgetTitle : "line Chart Widget",
					widgetId : "id003",
					widgetType : "chart",
					getDataBySelection : true,
					widgetContent : {
						data : myExampleData.lineChartData,
						options : myExampleData.lineChartOptions
					}

				}, {
					widgetTitle : "Lady gaga tweets",
					widgetId : "tweet123",
					widgetContent : $("#myTweets")
				}];

				//basic initialization example
				$("#myDashboard").sDashboard({
					dashboardData : dashboardJSON
				});

				//table row clicked event example
			

				//plot selected event example
				

				//example for adding an line chart widget
		

			});

		</script>
	</head>

	<body>
		<!-- <label>Features :</label>
		<button id="btnAddWidget">
			1) Add Widget
		</button>
		<button id="btnAddTableWidget">
			2) Add Table widget
		</button>
		<button id="btnDeleteWidget">
			3) Delete Table Widget
		</button>
		<button id="btnAddPieChartWidget">
			4) Add Pie Chart widget
		</button>
		<button id="btnAddBarChartWidget">
			5) Add Bar Chart widget
		</button>
		<button id="btnAddLineChartWidget">
			6) Add Line Chart widget
		</button>

		<div id="switcher" style="float:right;"> </div>
		
		<hr/> -->
		<ul id="myDashboard">

		</ul>

		<div id="myTweets"> </div>

	</body>
</html>